ספריית Jquery היא ספרייה מוכרת המשתייכת לשפה JavaScript, אבל למה בכלל להשתמש בה?
לא מזמן פנה אליי חבר שרק התחיל ללמוד על סביבת הWeb, אחרי שהוא למד html&css הוא התקדם לשפה המוכרת - JavaScript, אבל משום מה, הוא קצת התקשה בה, כמעט כל פעולה שהוא ניסה לעשות הצריכה ממנו לכתוב קוד לא קצר, בסופו של דבר קצת נמאס לו והוא שאל אותי אם יש דרך יותר קצרה לעשות את כל הפעולות האלו, תנחשו מה הייתה התשובה שלי? כן - Jquery.
אני רוצה להתחיל בהברה, JQ היא לא שפה מפני עצמה (למרות שיש לה דוקומנטציה משלה), אלא היא ספרייה שנבנתה על מנת להקל על המתכנת, למה אני מתכוון?
הספרייה (שמתם לב שקראתי לה ספרייה ולא שפה כן?) נבנתה על השפה JavaScript בצורה כזאת שאם נשתמש בה נוכל לחסוך זמן רב של עבודה, היא ספרייה של פונקציות שהוכנו להקלה על העבודה, רוצים לראות דוגמה?
<!DOCTYPE html>
<html>
<head>
<script>
function date()
{
document.getElementById("dateHere").innerHTML=Date();
}
</script>
</head>
<body>
<p id="dateHere"></p>
<button type="button" onclick="date()">get date</button>
</body>
</html>
<html>
<head>
<script>
function date()
{
document.getElementById("dateHere").innerHTML=Date();
}
</script>
</head>
<body>
<p id="dateHere"></p>
<button type="button" onclick="date()">get date</button>
</body>
</html>
קוד די קצר נכון? אני מניח שכולכם מבינים מה הקוד עושה - ברגע הלחיצה על הכפתור, הפסקה עם הID dateHere תקבל את התאריך של היום.
אבל מה אם יש לנו מאות של כפתורים? נעבור אחד אחד ונעשה onclick?
שימו לב לקוד הבא:
<!DOCTYPE html>
<html>
<head>
<script>
$(document).ready(function(){
$("body").find("button").click(function(){
$("#dateHere").text(Date());
});
});
</script>
</head>
<body>
<p id="dateHere"></p>
<button type="button">get date</button>
</body>
</html>
<html>
<head>
<script>
$(document).ready(function(){
$("body").find("button").click(function(){
$("#dateHere").text(Date());
});
});
</script>
</head>
<body>
<p id="dateHere"></p>
<button type="button">get date</button>
</body>
</html>
הקוד יחזיר לנו אותה תוצאה, אבל הוא יחפש את כל הכפתורים שבדף, ועל לחיצה עליהם הוא יחזיר את התאריך לפסקה. וזו רק דוגמה אחת מתוך מאות שמקצרת ועושה את העבודה קלה יותר.
אז ללמוד רק JQ?
ברור שלא, עד כמה שהספרייה עושה את העבודה קצרה יותר, היא לא מושלמת, יש דברים שאין בה וחייבים להשתמש בJavaScript, למשל כמו לולאות, או תנאים, וכדו', כמובן שאתם גם צריכים להבין את השפה ואת דרך העבודה שלה על מנת ללמוד JQ בצורה יעילה.
זה היה מדריך קצר והראשון שלי תאמת, אשמח לשמוע קצת תגובות:)
תגובות לכתבה:
מדריך נחמד, אבל הייתי מציע לך לעשות רק onclick ולא לפני זה find זה לא דרוש.
דבר שני כדאי תעבוד עם הזחות בjQuery כי יותר נוח עם הזחות ורוב האתרים שמלמדים jQuery אם לא כולם משתמשים בהזחות.
בהצלחה במדריכים הבאים שלך.
אני מודע לכך רק שאם עושים onclick בJquery בלי find הוא יעשה רק על האלמנט הראשון שעונה לid/class המדובר, ולשם ההדגמה הייתי צריך את זה על כל הכפתורים בדף.
ואני יודע בנוגע להזחות, אני תמיד משתמש אם כי כאן רשמתי את הקוד בתוך העורך של האתר וטאבים לא בדיוק עובדים כאן בצורה שאנו מעוניינים לה.
תודה!
זה נכון שהfind זה להכל.
דבר שני tab = 8 רווחים.
*טאב = 4 רווחים לא 8 התבלבלתי.
אתה זה לא ידעתי אני פשוט משתמש במקש טאב כשאני בנוטפד++XD
תודה אני אדע מעכשיו.
תכתוב בנוטפאד ופשוט תעתיק לפה.
עכשיו הקוד קבל צורה יפה:)
אלכס במדריך הבא אני אעשה את זה תודה.